<template>
  <uni-nav-bar title="邀请好友" left-icon="left" @clickLeft="redirectTo('index/mine')" :fixed="true" statusBar></uni-nav-bar>
  <image :src="shareImg" style="width: 100%; height: 94vh" mode="aspectFill" :show-menu-by-longpress="true"></image>
  <!-- #ifdef H5 -->
  <webWechat></webWechat>
  <!-- #endif -->
</template>

<script setup lang="ts">
import { shareUserInfo } from '@/gql/user';
import webWechat from '@c/pobulic/webWechat.vue';
import { getDriverID } from '@/stores/driverID';
import { redirectTo } from '@/utils/navigator';
import { showLoading } from '@/utils/prompt';
import { toPublish } from '@mqtt';
import { onShareAppMessage, onLoad, onShareTimeline } from '@dcloudio/uni-app';
import { ref } from 'vue';
import { poster3 } from '@/utils/Static';
/**
 * 邀请好友信息
 * @param driver_id  用户ID
 * @param shareImg  分享图片
 */
// static
const driver_id = getDriverID();
const shareImg = ref('');
/**
 * 初始化分享页面信息
 */
function init() {
  showLoading('加载中');
  const payload = {
    query: shareUserInfo,
    variables: { driver_id },
  };
  toPublish('ql/driver/getFriend', payload, (obj: any) => {
    const { data } = obj;
    shareImg.value = data.driver_info.yq_qrcode;
  });
}
init();

onLoad(() => {
  //设置下方的Menus菜单，才能够让发送给朋友与分享到朋友圈两个按钮可以点击
   // #ifdef MP-WEIXIN
  uni.showShareMenu({
    withShareTicket: true,
    menus: ['shareAppMessage', 'shareTimeline'],
  });
  // #endif
});
// 分享好友
onShareAppMessage((res) => {
  return {
    title: '安蓝车用尿素互联网整体解决方案',
    path: '/pages/index/filling',
    imageUrl:poster3,
    desc: '品牌直销 大厂品质 国六标准 车用尿素溶液自助加注',
  };
});
//分享到朋友圈
onShareTimeline(() => {
  return {
    title: '安蓝车用尿素互联网整体解决方案',
    path: '/pages/index/filling',
    imageUrl:poster3,
    desc: '品牌直销 大厂品质 国六标准 车用尿素溶液自助加注',
  };
});
</script>

<style scoped lang="less">
.shearImg {
  width: 100%;
  height: 94vh;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
</style>
